<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<title>${tagName}</title>
    <link rel="stylesheet" type="text/css" href="${request.contextPath}/resources/css/custag.css">
</head>
<body>
	<div class="search-box">
		<div class="search-input">
			<div class="search-item">
				<img src="${request.contextPath}/resources/img/search.png">
				<span>搜索</span>
			</div>
			<input class="search-text" type="text" id="tagName" onkeydown="keySeach()">
			<img class="img-search" src="${request.contextPath}/resources/img/search.png">
			<img class="img-close" src="${request.contextPath}/resources/img/close.png">
		</div>
		<span class="cancel-btn" style="display: none">取消</span>
	</div>
	<div id="cusTagList">
		<!-- 标签问题内容 -->
	</div>
</body>
<script src="${request.contextPath}/resources/js/jquery-3.2.1.min.js" type="text/javascript"></script>
<script src="${request.contextPath}/resources/js/layer/layer.js" type="text/javascript"></script>
<script src="${request.contextPath}/resources/js/jquery.tmpl.min.js" type="text/javascript"></script>
<script src="${request.contextPath}/resources/js/scrollpagenation.js" type="text/javascript"></script>
<script src="${request.contextPath}/resources/js/custag.js" type="text/javascript"></script>
<script id="cusTagListTempl" type="text/x-jquery-tmpl">
{{each(i,rows) rows}}
	<div class="select-box">
		<div class="select-item" onclick="toCusTagAnswer('{{= rows.tagId}}','{{= rows.id}}','{{= rows.inputMode}}')">
			<div class="select-title">
				{{= rows.question}}
				{{if rows.answer != null}}：
				<span style="color:#FF822E">
					{{= rows.answer}}
				</span>
				{{/if}}
			</div>
			<img src="${request.contextPath}/resources/img/arrow.png">
		</div>
	</div>	
{{/each}}	
</script>
<script type="text/javascript">
	//搜索功能 回车事件
	function keySeach(){
	 	if (event.keyCode==13) { //回车键的键值为13
	 		$("#cusTagList").empty();
	 		loadCusTagListAjax.init();
		}
	}
	//获取客户标签列表
	var loadCusTagListAjax = new ScrollPagenation({
		pageNumber : 1,
		pageSize : 20,
		scrollEl : $(document),
		height : $(window).height(),
		loadUI : function(showflag) {
			if (showflag) {
				layer.load(0, {shade: false}); //弹出加载层
			} else {
				layer.closeAll('loading'); //关闭加载层
			}
		},
		nextPage : function(o) {
			$.ajax({
				type: "POST",
				url: "${request.contextPath}/appapi/getCusTagList",
				data: {
					"pageNum":o.pageNumber,
					"pageSize":o.pageSize,
					"customerId": "${customerId}",
					"typeId": "${typeId}",
					"tagName": $("#tagName").val()
				},
				dataType : "json",
				success: function(data){
					if(data == null){
						layer.closeAll('loading'); //关闭加载层
						layer.msg("数据获取失败");
						return false;
					}
					if(data.rows == null){
						layer.closeAll('loading'); //关闭加载层
						layer.msg("该标签分类下暂无数据");
						return false;
					}
					//获取分页参数
					o.callbackFn(Number(data.totalPages) > Number(o.pageNumber));
					console.log(data);
					$("#cusTagListTempl").tmpl(data).appendTo($("#cusTagList"));
				}
			});
		}
	});
	//跳转答案页
	function toCusTagAnswer(tagId, extId, type){
		var url = "${request.contextPath}/appapi/toCusTagAnswer?tagId=" + tagId;
			url+= "&extId=" + extId;
		    url+= "&customerId=${customerId}";
		    url+= "&userId=${userId}";
		    url+= "&type=" + type;
		window.location.href = url;
	}
</script>
</html>